import React, {PureComponent} from 'react'
import '../../css/head.scss'
import Link from 'react-router-dom/Link'

class Head extends PureComponent {
    constructor() {
        super()
        this.state = {
            link: '/',
            text: '进入综合监控'
        }
        const currentUrl = location.hash.split('#')[1]
        if (currentUrl === '/' || currentUrl === '') {
            this.state.link = '/manager/framework'
            this.state.text = '进入管理模块'
        }
    }

    changeSubMenu = (link) => {
        if (link === '/') {
            this.setState({
                link: '/manager/framework',
                text: '进入管理模块'
            })
        } else {
            this.setState({
                link: '/',
                text: '进入综合监控'
            })
        }
        this.props.handleClick()
    }

    componentWillReceiveProps() {
        if (location.hash.split('#')[1] !== '/' && this.state.link !== '/') {
            this.changeSubMenu(location.hash.split('#')[1])
        }

        if (location.hash.split('#')[1] === '/' && this.state.link === '/') {
            this.changeSubMenu(location.hash.split('#')[1])
        }
    }

    render() {
        const {link} = this.props
        return (
            <div className="head-container">
                <div className="title-box">
                    <p>H3C 智能制造监控中心</p>
                    <span>Monitoring Center</span>
                </div>
                <div className="index-link">
                    {/*<a href={link.href}>{link.title}</a>*/}
                    <Link to={this.state.link} replace>
                        <div onClick={this.changeSubMenu.bind(this, this.state.link)}>
                            {this.state.text}
                        </div>
                    </Link>
                </div>

            </div>
        )
    }
}

export default Head